<template>
  <div class="box flex-al al-start">
    <div class="w100 flex-row j-sb al-start">
      <build-el-h1 name="大赛报道标题.png" type="1"></build-el-h1>
      <build-el-more src="Report"></build-el-more>
    </div>
    <div class="w100">
      <build-el-report-list
        v-for="item in tableData "
        :key="item.newsId"
        :title="item.title"
        @handNes="handNes(item.newsId,item)"
        :update-time="item.updateTime"
      ></build-el-report-list>
    </div>
  </div>
</template>
<script>
import buildElH1 from '../build-el-h1'
import buildElMore from '../build-el-more'
import buildElReportList from '../build-el-report-list'

export default {
  components: {
    buildElH1,
    buildElMore,
    buildElReportList,
  },
  data() {
    return {
      tableData: null,
      total: 0,
      pageSize: 15,
      pageNow: 1,
    }
  },
  async created() {
    await this.init(1)
  },
  methods: {
    handNes(id, item) {
      console.log(item)
      if (item.pcJumpLink != null) {
        window.open(item.pcJumpLink)
      } else if (item.mobileJumpLink != null) {
        window.open(item.mobileJumpLink)
      } else {
        this.toPage(id)
      }
    },
    async init(page) {
      this.tableData = []
      let tableData = await this.api.selectNewsList7(page, this.pageSize)
      this.total = tableData.total
      this.tableData = tableData.list
      console.log('tableData', this.tableData)
    },
    changePage(e) {
      this.pageNow = e
      this.init(e)
    },
  },
}
</script>
<style lang="less" scoped>
.box {
  // padding-left: calc((100vw - 1200px) / 2);
  width: 100%;
  box-sizing: content-box;
  padding: 0 30px;
  padding-bottom: 50px;
  box-sizing: border-box;
}
</style>
